<!--
 * @Author: lmk
 * @Date: 2020-12-25 10:32:56
 * @LastEditTime: 2021-12-07 14:55:07
 * @LastEditors: lmk
 * @Description: 
-->
<template>
	<mescroll-uni :ref="'mescrollRef' + tabIndex" @init="mescrollInit" @down="downCallback" @up="upCallback">
		<view class="u-padding-left-32 u-padding-right-32 swiper-box-padding" v-if="dataList.length">
			<view v-for="(item, index) in dataList" :key="index" class="u-margin-top-20" @click="goPathDetail(item)">
				<!-- <list-item
          :item="item"
          :showStar="false"
          :isShare="false"
          :isTag="false"
          :showFooterRightStar="false"
          :showTime="false"
        /> -->

				<item-Box :padding="24">
					<view class="list-item u-col-top u-flex">
						<view class="position-relative">
							<item-image :img="item.img" height="346" :radius="17" width="214" />
						</view>
						<!-- 右侧 -->
						<view class="right-col u-flex u-flex-col u-flex-1">
							<view class="u-padding-top-23 u-padding-bottom-23" style="width: 100%">
								<view class="u-flex u-row-between">
									<view class="box-title text-bold u-font-36 item-name u-flex-1 u-line-2 cur-title">{{ item.title }}</view>
								</view>
								<view class="desc u-font-24 content-desc-item u-line-4">{{ item.desc }}</view>

								<view class="day-color u-font-20 u-padding-top-34 u-padding-bottom-28">发布时间：{{ item.time }}</view>

								<view class="u-position-relatives" style="width: 100%">
									<view class="u-flex">
										<view class="u-flex-1 u-flex">
											<item-image type="1" :img="item.avatar" :size="42" :fade="false" />
											<text
												class="u-font-28 u-line-1 username-text day-colors ">{{ item.createName || "" }}</text>
										</view>
										<!-- 点赞 -->
										<view class="u-flex">
											<view class="u-flex u-margin-right-14">
												<u-icon name="chakan" size="30" custom-prefix="index-custom-icon">
												</u-icon>
												<!-- <u-image src="/static/images/read.png" width="32" height="32" :lazy-load="false" :show-loading="false" :fade="false" ></u-image> -->
												<text
													class="u-font-20 text-color-txtTheme u-margin-left-10">{{ item.browse || 0 }}</text>
											</view>
										</view>
									</view>
								</view>
							</view>
						</view>
					</view>
				</item-Box>
			</view>
		</view>
	</mescroll-uni>
</template>

<script>
	import upCallback from "@/mixins/upCallbackMixin.js";
	export default {
		mixins: [upCallback], // 注意此处还需使用MescrollMoreItemMixin (必须写在MescrollMixin后面)
		props: {
			form: {
				type: Object,
				default: () => ({}),
			},
			tabIndex: {
				type: Number,
				default: 0,
			},
		},
		data() {
			return {
				name: "getInfomation",
				apiType: "wxInformation",
				apiModule: "sns",
			};
		},
		methods: {
			goPathDetail(item) {
				this.$u.route({
					url: "/pagesA/newDetail/index",
					params: {
						id: item.id,
            item:item
					},
				});
			},
		},
	};
</script>

<style lang="scss" scoped>
	.position-relative {
		position: relative;
	}
	.cur-title{
		min-height: 68rpx;
		line-height: 42rpx;
	}
	.desc {
		margin-top: 20rpx;
		min-height: 136rpx;
	}

	.list-item {
		line-height: 1;
	}

	.right-col {
		padding-left: 26rpx;
		padding-right: 6rpx;
		flex-shrink: 0;
		box-sizing: border-box;
	}

	.username-text {
		width: 25vw;
	}
</style>
